<template>
<h2>会员信息列表</h2>
姓名<input type="text" v-model="a.mname"/>
手机号<input type="text" v-model="a.phone"/>
身份证号<input type="text" v-model="a.idcard"/>
登记时间<input type="date" v-model="a.cdate"/>
卡号<input type="text" v-model="a.mcard"/>
<input type="button" value="查询" @click="chaxun"/>
<table border="1">
    <thead>
        <tr>
            <td>姓名</td>
            <td>卡号</td>
            <td>手机号</td>
            <td>身份证号</td>
            <td>登记时间</td>
            <td>消费金额</td>
            <td>生日</td>
            <td>会员类型</td>
        </tr>
    </thead>
    <tbody>
        <tr v-for="a in m">
            <td>{{ a.mname }}</td>
            <td>{{ a.mcard }}</td>
            <td>{{ a.phone }}</td>
            <td>{{ a.idcard }}</td>
            <td>{{ a.cdate.substring(0,10) }}</td>
            <td>￥{{ a.moneys.toFixed(2) }}</td>
            <td>{{ a.birday.substring(0,10) }}</td>
            <td>{{ a.mebertype }}</td>
        </tr>
    </tbody>
</table>


</template>

<script setup lang="ts">
import {onMounted,ref} from 'vue'
import axios from 'axios'
const m=ref([{
    id:'',
    mcard:'',
    mname:'',
    phone:'',
    birday:'',
    moneys:0,
    idcard:'',
    cdate:'',
    mebertype:''
}])

const a=ref({
    mname:'',
    phone:'',
    idcard:'',
    cdate:'',
    mcard:''
})
//页面加载显示列表
onMounted(()=>{
    var obj={
        mcard:a.value.mcard,
        phone:a.value.phone,
        idcard:a.value.idcard,
        cdate:a.value.cdate,
        mname:a.value.mname
    }
    axios.get('https://localhost:7113/api/Meber/MeberShow',{
        params:obj
    })
    .then((res)=>{
        m.value=res.data
    })
    .catch((err)=>{
        alert(err);
    })
})
//查询
const chaxun=()=>{
    var obj={
        mcard:a.value.mcard,
        phone:a.value.phone,
        idcard:a.value.idcard,
        cdate:a.value.cdate,
        mname:a.value.mname
    }
    axios.get('https://localhost:7113/api/Meber/MeberShow',{
        params:obj
    })
    .then((res)=>{
        m.value=res.data
    })
    .catch((err)=>{
        alert(err);
    })
}

</script>